import React, {useContext} from 'react';
import {createUseStyles} from 'react-jss';
const useStyle  = createUseStyles({
    title:{
        background:'lightblue',
        '&:hover':{
            color:'gold',
        }
    },
    list:{
        background:'blanchedalmond',
        '& a':{
            color:'red',
            '&:hover':{
                color:'lightblue'
            }
        }
    },
    content:{
        background:'gray',
    }
})
class ReactHocClazz extends React.Component {
    render(){
        const {title, list,content} = this.props;
        return (
            <>
                <div className={title}>
                    链接标题
                </div>
                <div className={list}>
                    <a href={'http://localhost:8080/'}>
                        hello world
                    </a>
                </div>
                <div className={content}>
                    content
                </div>
            </>
        )
    }
}

 const ReactHocClazzProxy = function (Component) {
    return function HOC(){
        const sty = useStyle();
        return (
            <Component {...sty}/>
        )
    }

};

export default ReactHocClazzProxy(ReactHocClazz);

